<template>
<div>
  <h1>请假页面</h1>
  <table>
    <tr v-for="i in params" :key="i.id">
      <td>{{i.lable}}</td>
      <td v-if="i.type=='textarea'">
        <textarea name="" cols="30" rows="10"></textarea>
      </td>
      <td v-else-if="i.type =='select'">
        <select name="" v-model="form[i.lable]">
          <option :value="j.name" v-for="j in i['values']" :key='j.id' >{{j.name}}</option>
        </select>
      </td>
      <td v-else>
        <input :type="i.type" v-model="form[i.lable]">
      </td>
    </tr>
  </table>
  <table>
    <tr>
      <td>审批人</td>
    </tr>
    <tr>
      <td><van-checkbox-group v-model="result" direction="horizontal">
        <van-checkbox :name="i.id" v-for="i in rolelist" :key="i.id">{{i.name}}</van-checkbox>
      </van-checkbox-group></td>
    </tr>
  </table>
  <button @click="add">提交</button>
  </div>


</template>

<script>
import axios from "axios";

export default {
  name: "show_wor",
  data(){
    return{
      list:[],
      id:this.$route.query.id,
      params:[],
      rolelist:[],
      result:[],
      form:{},
      userid:localStorage.getItem('userid')
    }
  },
  methods:{
    show(){
      axios({'url':'user/origin?id='+this.id,'method':'get'})
      .then(i=>{
        this.list = i.data.list
        this.params = JSON.parse(i.data.list.params)
      })
    },
    show_role(){
      axios({'url':'user/show_role','method':'get'})
      .then(i=>{
        this.rolelist = i.data.list
      })
    },
    add(){
      let data = new FormData()
      data.append('form',JSON.stringify(this.form))
      data.append('result',JSON.stringify(this.result))
      data.append('userid',this.userid)
      console.log(data)
      axios({'url':'user/show_role','method':'post','data':data})
      .then(i=>{
        if (i.data.code ==200){
          this.$router.push({path:'/qjsp'})
        }
      })
    }
  },
  mounted() {
    this.show()
    this.show_role()
  }
}
</script>

<style scoped>

</style>